<!-- 导航组件 -->
<script lang="ts" setup>
const props = withDefaults(
  defineProps<{
    label: string
    icon: any // 图表组件
    path: string
    active: boolean
  }>(),
  {},
)
</script>

<template>
  <n-button
    :type="active ? 'primary' : 'default'"
    circle
    class="flex flex-col items-center"
    text
    @click="$emit('click')"
  >
    <component :is="icon" class="h-[53px] w-[53px] mr-4 mb-1" />

    <span class="text-lg">{{ label }}</span>
  </n-button>
</template>

<style scoped></style>
